<template>
  <div class="rightpanel">
      <label for="">backColor:</label>
      <el-input v-model="bgColor" @change="pringIn" />
      {{bgColor}}
  </div>
</template>

<script>
import { mapState } from 'vuex'

export default {
    name:'rightpanel',
    data() {
        return {
           backColor:''
        }
    },
    computed:{
      ...mapState({
        bgColor: state => state.test.rightpanel.bgColor
        // bgColor: {
        //   get: state => state.test.rightpanel.bgColor,
        //   set: (val) => this.backColor = val
        // }
      })
    },
    methods:{
      pringIn(value) {//拿到input输入的值，去修改state中的bgColor
        console.log('111');
        console.log(value);
        // this.bgColor.set(value)
        // this.$store.commit('ChangeBgcolor',value)
        // this.bgColor = value;
        // this.$store.state.test.rightpanel.bgColor = this.bgColor
      }
    }
}
</script>

<style scoped>

</style>
              